<!DOCTYPE html>
<!--本页面需要实现的功能：
	1.各信息的有效性校验：
	->不符合时，显示错误信息
	->符合时，初步设计不做任何显示，后期可以实现输入框右侧出现 “对勾” 等 
	2.form表单的action，后期需要添加数据库提交的action，现在只跳转到首页index.html
	3.form表单，第一行传入当前用户名参数
 -->
<html>
  <head lang="en">
    <title>个人信息修改</title> 
    <meta charset="UTF-8"> 
    <link rel="stylesheet" type="text/css" href="css/reset.css"> 
    <!--
    <link rel="stylesheet" type="text/css" href="css/common-index.css">
     -->
    <link rel="stylesheet" type="text/css" href="css/common.css">
    
    <link rel="stylesheet" type="text/css" href="css/information_modification.css">
    
    <!-- 引入require.js，注意格式 --> 
   	<script src="js/require.js" defer async="true" data-main="js/information_modification_main"></script>
   		
  </head>
  
<body>
	
	<!-- 头部栏 -->
    <header class="header_outbox">
		<div class="header_inbox">
	         <div class="loginbox">
	             <p>欢迎访问Husky机械配件商城</p>
	             <a href="index.html" target="_blank">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[ 访问官网 ]</a>
	             <span id="register-info"> 
	                 <a href="login.html" class="login">&nbsp;&nbsp;&nbsp;&nbsp;登录&nbsp;&nbsp;|</a>
	                 <!-- <img src="images/common/header_line.jpg"> -->
	                 
	                 <a href="register.html" class="login">&nbsp;&nbsp;&nbsp;免费注册&nbsp;&nbsp;</a>
	             </span>
	             <span id="login-info" style="display: none;">
	                 <a href="information_modification.html" id="headerUsername" class="login"></a>
	                 
	                 <a href="#" id="headerLogout" class="login">|&nbsp;&nbsp;退出</a>
	             </span>
	         </div>
             <ul class="my_action fix">
                 <li>
                     <a href="product_like.html">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;我的关注</a>
                 </li>
                 <li>
                     <img src="images/common/mix_car.png">
                     <a href="cart.html">购物车<span id="cartQuantity">[0]</span></a>
                 </li>
                 <li>
                     <a href="index.html">我的商城</a>
                 </li>
             </ul>
        </div>
    </header>
	<!--头部导航结束-->
	<!-- 最上方留白处-->
    <div class="white" style="height:28px;">
        <p>Husky</p>
    </div>
    
    
   
    <div class="action_search_box wrapper_box">
        <a class="logo" href="index.html"></a>
        <div class="inputbox" style="margin-top:10px;">
        	<div>
        		<a class="search_icon " ></a>
            	<input type="text" id="keyword" name="keyword" placeholder="请输入您感兴趣的内容">
           	 	<a id="searchBtn" class="searchbtn" href="javascript:search();">搜&nbsp;索</a>
            </div>
        </div>
        <img class="telephonenumber" src="images/common/telephone_number.jpg" >
    </div>
    <!--头部搜索结束-->
     
     
     
     
    <!--分割线-->
	<hr style="height: 1px; border: none; border-top: 1px solid #DDD; margin: 25px 0 0px;">
	
	<div>
		<div class="content_box clear_fix">
			<!-- 左部导航栏 -->
			<div class="left_nav l">
		    	<div class="person_info">
		    		<div class="head_img">
		    			<img src="images/common/deimg.png" alt="">
		    		</div>
		    		<div class="welcome_info">
		    			欢迎回来，[<a id="left_username"></a>]
		    		</div>
		    		<div class="level_score">
		    			<div class="clearfix">
		    				<div class="l"></div>
		    				<div class="level_value l"></div>
		    			</div>
		    			<div class="clearfix">
		    				<div class="l" style="margin-left:33px;">积分：</div>
		    				<div id="left_userpoints" class="score_value l">0</div>
		    			</div>
		    		</div>
		    	</div>
		    	<div>
		    		<div class="title">
		    			<div class="dashed">我的交易</div>
		    		</div>
		    		<div class="item"><a href="order_list.html">我的订单</a></div>
		    		<div class="item "><a href="cart.html">我的购物车</a></div>
		    		<!-- <div class="item"><a href="#">我的积分</a></div> -->
		    		<!-- <div class="item"><a href="#">我的积分消费</a></div> -->
		    		<div class="item"><a href="product_like.html">我的关注</a></div>
		    		<!-- <div class="item"><a href="#">我的购买咨询</a></div> -->
		    		<!-- <div class="item"><a href="#">我的优惠券</a></div> -->
		    		<div class="item"><a href="address_management.html">收货地址管理</a></div>
		    		<!-- <div class="item"><a href="#">我的推荐</a></div> -->
		    	</div>
		    	<div style="margin-top:16px;">
		    		<div class="title">
		    			<div class="dashed">我的账户</div>
		    		</div>
		    		<div class="item active"><a href="information_modification.html">个人资料</a></div>
		    		<div class="item"><a href="password_modification.html">修改密码</a></div>
		    	</div>
		    </div>
		    
		    <!-- 个人信息内容 -->
		    <div class="right_title">个人资料</div>
		    <!-- 内容的“个人资料”与表单分割线 -->
        	<hr style="width: 870px;float: right; border: none;border-top: 1px solid #DDD;margin: 5px 0px 0px 0px;color:#b1191a">
<!-- *在这里form的action后期改成跳转和提交给后台，现在只是跳转到首页，已修改 -->
<form id="infoForm" action="#" method="post" novalidate="novalidate">
	<div class="infomation_box">
		<div>
			<div>用户名：&nbsp;</div>
<!-- 在这里添加当前用户名参数 -->
			<input type="text" id="username" name="username" maxlength="20" autocomplete="off" >
		</div>               
		<div>
		
			<div>姓名：&nbsp;</div>
			
			<input type="text" id="name" name="name" maxlength="20" autocomplete="off" placeholder="请填写真实姓名">
			<div class="error_tip" id="nameError">姓名错误请重新输入</div>
		</div>
		
		<div >
			<div >性别:</div>
            <div style="padding-top: 5px;">
                <input type="radio" checked name="sex"  style="margin-right: 5px;" value="男">男
                <input type="radio" name="sex" style="margin-right: 5px;margin-left:10px;" value="女">女
            </div>
		</div>
		<div >
			<div >年龄:</div>
			<input type="text" id="age" name="age"  maxlength="20" autocomplete="off" placeholder="例：18">
			<div class="error_tip" id="ageError">年龄错误请重新输入</div>
		</div>
		<div >
			<div class="information_label">手机号:</div>
			<input type="text" id="phone" name="phone"   maxlength="20" autocomplete="off" placeholder="xxx-xxxxxxxx">
			<div class="error_tip" id="phoneError">手机号错误请重新输入</div>
		</div>
		<div >
			<div class="information_label">邮箱:</div>
			<input type="text" id="email" name="email"   maxlength="20" autocomplete="off" placeholder="例：xxx@xx.com">
			<div class="error_tip" id="emailError">邮箱错误请重新输入</div>
		</div>
		<input id="saveBtn" type="submit" class="saveBtn" value="保存" >
		<!-- 这里原本设置了个跳转，这里改为由js控制跳转 -->
		<!-- onClick="javascript:location.href='index.html';"> -->
		
	</div>
</form>
		</div>
		    
	    <!-- 底部信息 -->
	    <div id="product_service" class="content_box clearfix">
	    	<ul>
	    		<li class="item l">
	    			<p class="item_icon icon1 l"></p>
	    			<div class="item_text l">
	    				<p class="text_tit">真实货源</p>
	    				<p class="text_info">一手货源&nbsp;真实存在</p>
	    			</div>
	    		</li>
	    		<li class="item l">
	    			<p class="item_icon icon2 l"></p>
	    			<div class="item_text l">
	    				<p class="text_tit">品质保障</p>
	    				<p class="text_info">垂直专业&nbsp;优选厂商</p>
	    			</div>
	    		</li>
	    		<li class="item l">
	    			<p class="item_icon icon3 l"></p>
	    			<div class="item_text l">
	    				<p class="text_tit">服务保障</p>
	    				<p class="text_info">专业服务团队</p>
	    			</div>
	    		</li>
	    		<li class="item l">
	    			<p class="item_icon icon4 l"></p>
	    			<div class="item_text l">
	    				<p class="text_tit">交易透明</p>
	    				<p class="text_info">买卖双方面谈价格</p>
	    			</div>
	    		</li>
	    	</ul>
	    </div>
	</div> 
	   
	    <div class="footerbox">
	    	<div class="footer">
	    		<div class="content_box">
	    			<div class="footerinside">
		    			<h1>新手指南</h1>
		    			<a href="#" target="_blank">免费注册</a>
		    			<a href="#" target="_blank">个人资料及密码</a>
		    			<a href="#" target="_blank">商品关注</a>
		    			<a href="#" target="_blank">查询订单</a>
		    			<a href="#" target="_blank">购物流程</a>
	    			</div>
	    			<div class="footerinside">
						<h1>付款/退款</h1>
		    			<a href="#" target="_blank">在线支付</a>
		    			<a href="#" target="_blank">银行转账</a>
		    			<a href="#" target="_blank">发票办理</a>    		
		    		</div>
		    		<div class="footerinside">
		    			<h1>配送方式</h1>
		    			<a href="#" target="_blank">快递配送</a>
		    			<a href="#" target="_blank">零担物流</a>
		    		</div>
		    		<div class="footerinside">
		    			<h1>售后服务</h1>
		    			<a href="#" target="_blank">退货流程</a>
		    			<a href="#" target="_blank">退货政策</a>
		    		</div>
		    		<div class="footerinside">
		    			<h1>帮助中心</h1>
		    			<a href="#" target="_blank">常见热点问题</a>
		    			<a href="#" target="_blank">联系我们</a>
		    			<a href="#" target="_blank">投诉与建议</a>
		    		</div>
		    	</div>
	    	</div>
	    	<div class="copyright_bgcolor">
	        	<div class="copyright">Copyright © 2018 XXX有限公司 版权所有 保留一切权利 鲁ICP备XXXXXXXX号-X</div>
        	</div>
    	</div>
	
</body>
</html>
